<?php include('header.php');?>
<div class="container-fluid">
	<div class="row-fluid">
		<div class="span 12">
			<h1>ADMIN</h1>
		</div>
	</div>
	<div class="row-fluid">
		<div class="span2"">
			<?php include('lefter.php');?>
		</div>
		<div class="span10">
			<div class="row-fluid">
				<div class="span8">
					<h3>
						<span>MAIN</span>
					</h3>
				</div>
			</div>
			<hr />
			<table>
				<tbody>
					<tr class="sortable">
					<?php foreach($main_rows as $row) :?>
						<td id="<?=$row['id']?>">
							<div class="fileupload fileupload-exists" data-provides="fileupload">
								<input type="hidden" name="<?=$row['id']?>" value="<?=$row['id']?>" />
								<div class="fileupload-preview thumbnail save-image-div"><?php if(empty($row['image_is_image'])) :?><?=$row['image_orig_name']?><?php else :?><img src="<?=UPLOAD_DIR?>/<?=$row['image_file_name']?>" /><?php endif;?></div>   
								<div>
									<a href="#view" class="btn fileupload-exists btn-select"  data-toggle="modal" data-dismiss="fileupload">Select</a>
								</div>  
							</div>
						</td>
					<?php endforeach;?>
					</tr>
				</tbody>
			</table>
			<div id="view" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="view_label" aria-hidden="true">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
					<h3 id="view_label" class="view-label"></h3>
					<div class="btn-group" data-toggle="buttons-radio">
						<button type="button" class="btn active select-work">WORK</button>
						<button type="button" class="btn select-blog">BLOG</button>
					</div>
				</div>
				<div class="modal-body">
					<div id="view_list"></div>
				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
				</div>
			</div>
			<div class="row-fluid">
				<div class="span4 offset8">
					<div class="pull-right">
					<button type="button" class="btn btn-sort hidden-phone">Save sort</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script src="<?=JS_DIR?>/jquery-1.8.3.min.js"></script>
<script src="<?=JS_DIR?>/respond.min.js"></script>
<script src="<?=JU_DIR?>/js/jquery-ui-1.9.2.custom.min.js"></script>
<script src="<?=BS_DIR?>/admin/js/bootstrap.min.js"></script>
<script src="<?=JS_DIR?>/jquery.tmpl.min.js"></script>
<script>
var limit = 5;
var view_id = 0; 
var sort_array = [<?=$sort_string?>];

function view_work(offset) {
	$("#view_list").empty();
	$.ajax({
		type: 'post',
		url: "<?=base_url('admin/main_view_work')?>/"+limit+"/"+offset,
		success: function(data){
			$("#view_label").html("SELECT");
			$("#select_work").tmpl(data).appendTo("#view_list");
		},
		error: function(jqXHR, textStatus, errorThrown){
			alert( errorThrown );
		}
	});
}
function view_blog(offset) {
	$("#view_list").empty();
	$.ajax({
		type: 'post',
		url: "<?=base_url('admin/main_view_blog')?>/"+limit+"/"+offset,
		success: function(data){
			$("#view_label").html("SELECT");
			$("#select_blog").tmpl(data).appendTo("#view_list");
		},
		error: function(jqXHR, textStatus, errorThrown){
			alert( errorThrown );
		}
	});
}
$(function() {
	$("tr.sortable").sortable();
    $("tr.sortable").disableSelection();
	$("a[data-toggle='modal']").click(function() {
		view_id = $(this).parent().parent().parent().attr("id");
		view_work(0);
	});
	$("#view").on("hidden", function() {
		$("#view_list").empty();
	});
	$("button.btn-sort").click(function() {
		var id_sort_array = [];
		var tr_td_object = $("tr.sortable").children("td");
		i = 0;
		$.each(tr_td_object, function() {
			id_sort_array.push({id: $(this).attr("id"), sort: sort_array[i]});
			i++;
		});
		$.ajax({
			type: 'post',
			url: "<?=base_url('admin/main_sort_action')?>",
			data: { 
				id_sort_array: id_sort_array
			},
			success: function(data){
				alert('Sort saved!');
			},
			error: function(jqXHR, textStatus, errorThrown){
				alert( errorThrown );
			}
		});
    });
    $(document).on("click", "button.btn-view-select", function() {
		$.ajax({
			type: 'post',
			url: "<?=base_url('admin/main_edit_action')?>",
			data: { 
				id: view_id,
				view_kind: $(this).attr("data-view_kind"),
				view_id: $(this).attr("data-view_id")
			},
			success: function(data){
				location.href = "<?=base_url('admin/main')?>";
			},
			error: function(jqXHR, textStatus, errorThrown){
				alert( errorThrown );
			}
		});
	});
    $(document).on("click", "button.select-work", function() {
    	view_work(0);
	});
	$(document).on("click", "button.select-blog", function() {
		view_blog(0);
	});
});
</script>
<script id="select_work" type="text/x-jquery-tmpl">
<div class="ul-table work">
	<ul class="header">
		<li class="no">NO</li>
		<li class="thumb hidden-phone">THUMB</li>
		<li class="date hidden-phone">DATE</li>
		<li class="title">TITLE</li>
		<li class="delete">SELECT</li>
	</ul>
</div>
<div class="ul-table ul-table-body work">
	{{tmpl(work_rows) "#select_work_list"}}
</div>
<div class="pagination pagination-centered">
	<ul>
		{{html pagination_links}}
	</ul>
</div>
</script>
<script id="select_work_list" type="text/x-jquery-tmpl">
<ul class="image-view">
	<li class="no">${id}</li>
	<li class="thumb hidden-phone">{{if !image_is_image}}<div class="thumb-text">${image_orig_name}</div>{{else}}<div class="thumb-image"><img src="<?=UPLOAD_DIR?>/${image_file_name}" /></div>{{/if}}</li>
	<li class="date hidden-phone">{{if date}}${date}{{else}}&nbsp;{{/if}}</li>
	<li class="title">${title1}</li>
	<li class="delete"><button type="button" class="btn btn-small btn-danger btn-view-select" data-view_kind="work" data-view_id="${id}">SELECT</button></li>
</ul>
</script>
<script id="select_blog" type="text/x-jquery-tmpl">
<div class="ul-table work">
	<ul class="header">
		<li class="no">NO</li>
		<li class="thumb hidden-phone">THUMB</li>
		<li class="date hidden-phone">DATE</li>
		<li class="title">TITLE</li>
		<li class="delete">SELECT</li>
	</ul>
</div>
<div class="ul-table ul-table-body work">
	{{tmpl(blog_rows) "#select_blog_list"}}
</div>
<div class="pagination pagination-centered">
	<ul>
		{{html pagination_links}}
	</ul>
</div>
</script>
<script id="select_blog_list" type="text/x-jquery-tmpl">
<ul class="image-view">
	<li class="no">${id}</li>
	<li class="thumb hidden-phone">{{if !image_is_image}}<div class="thumb-text">${image_orig_name}</div>{{else}}<div class="thumb-image"><img src="<?=UPLOAD_DIR?>/${image_file_name}" /></div>{{/if}}</li>
	<li class="date hidden-phone">{{if date}}${date}{{else}}&nbsp;{{/if}}</li>
	<li class="title">${title}</li>
	<li class="delete"><button type="button" class="btn btn-small btn-danger btn-view-select" data-view_kind="blog" data-view_id="${id}">SELECT</button></li>
</ul>
</script>
<?php include('footer.php');?>